好不容易成為前端工程師了，究竟該如何深入成為「專才」？
　
【不要以為你看到的就是全世界】
有很多菜鳥前端進入第一份工作後，就認為公司的環境就是整個業界的縮影，
從此就對「業界」有刻板印象，運氣好一點遇到好主管至少能開拓你的視野，運氣很差遇到爛環境，最糟甚至會讓你萌生繼續轉換跑道的念頭。
　
所以各位必須要先清楚了解，「你的開發能量會反射在你的公司環境」，
　
有許多朋友說：「我雖然還沒全部技能都涉獵，但都略懂，不過我很急著找工作所以就先投履歷了，但是邀請我面試的公司感覺都很差，還會要我做很多雜務，甚至要加班，是不是業界都是如此？」
　
其實上面所問的問題，他已經幫自己解答了，你既然技能掌握上都是半桶水，你又奢望能吸引到哪些好公司呢？
　
什麼都懂一點但又不專精，企業自然會把你當做助理來使喚，而說實在的你也沒有資格數落這些公司，創立公司就是必須自行思考財務流來支撐起一個公司，或許因為財務拮据而無法任何事項都面面俱到，但至少也在思考如何在業界中生存，所以自然會把一個任何都不怎麼會的職員當作「助理」來使喚，讓你成為公司的齒輪協助運轉，乃人之常情。
　
那麼到底該如何在第一份工作吸引到好公司呢？
我都會要求往前端工程師發展的，至少要做到運用三大框架做到前後端分離的完整作品。而前端設計師，則是必須透過 UI 軟體設計出 Mockup(精稿)，再設計 RWD+SCSS 設計出網頁版型。
　
如果你沒有自行累積到能量到這一步就去投入職場，你要有心理準備遇到的公司品質都不會太好。或者找你的都會是「接案型網頁設計公司」，或者是「中型企業時常辦活動，而產生的砲灰式活動版型」，開發的內容都千篇一律，要求的不是你的程式碼品質，而是要求你的快速。或者是乾脆讓你進來，之後讓你去摸些非前端領域的技能，例如後端、MIS。
　
我可以理解為了生活，自然想快速投入職場，但如果你來到上面公司，切記不要認為他們就能代表業界。初期你可以先以「了解軟體公司文化」、「部門協作」、「了解快速開發需要具備的技能」，但若是都掌握起來後就不能久待，切記不要成為有十年經驗，但是用一年經驗重複十次的人才。
　
所以如果你現在還有時間，請你至少要累積到我上面所提供的條件，再去找第一份工作，你才會發現找你的公司開始多元化了，自己也能稍微挑選符合自己開發能量的公司。
　
【前端專精方向】
　
這裡我就先以 CSS、JS 的方向來說明，
CSS 是易學難精的東西，
也因此大家都會誤認它是很好理解的語言。
　
但會寫不代表你寫得好，我這邊就提供幾個問句，
你思考看看自己的程度如何
　
1.你在開發的網頁版型，過了幾天再回頭看 CODE，你透過 class 名稱能立即回想自己是如何撰寫的嗎？
　
2.當專案進入維護階段，過了三個月臨時要改一個版型設定，你要花多少時間才有辦法進行修改？
　
3.如果今天版型需要多人開發，你會先建立基礎架構，並使用 SCSS 拆分任務進行分工嗎？
　
4.一個案子過了一年，回頭你再看時，你的感想是「靠這誰寫的？」，還是「我真是個天才，一年前寫得架構超神」
　
5.你能力是否有辦法訂定 CSS Guidelines，設計閱讀文件，讓你的部門其他同事跟著遵循，或者是讓其他事業群也能 follow，同時又能透過版本進行更新迭代？

如果你或你同事能力沒有到 4 或 5，說老實話你還差著遠呢，多看些 SMACSS、OOCSS、BEM、MVCSS 設計模式後，再看看大廠的程式碼像是 pure、Bootstrap、Semantic UI 找出類似共通點，再將它融合到自己的風格裡吧。
　
再來則是 JS 部分，我希望你更深入 JS 的核心，探索它的底層，運用各種方式來認識 JavaScript。
　
例如以下兩個資源：

IT 鐵人邦 kuro 重新認識 JavaScript
https://ithelp.ithome.com.tw/users/20065504/ironman/1259

IT 鐵人邦 卡斯伯 邁向 JavaScript 勇者之路
https://ithelp.ithome.com.tw/articles/10190562
　
你會發現上面每個"小節"，背後都有很底層的 JS 原理，我強烈建議你要開一個 medium 去整理自己的思考脈絡，你不用寫成讓別人易懂的 BLOG，而是寫給自己看的筆記，這也有助於幫你建立長期記憶，之後若要回顧，你最快回顧就是看你的筆記，而不會認為說這些觀念久了就忘了，讓筆記成為你的第二個腦是非常重要的。
　
當你花了 2~3 個月投入底層後，接下來就是實作了，
我知道你們也應該了解 JS 已經有無限可能，
你會 JS 後，很多 NPM 與相關軟體妳都可透過 JS 來開發，
與其如此，不如我實際點講業界案例。
　
前端其實有非常多領域可以涉獵，
例如說：
　
[Chrome 插件]
想個主題來寫個輔助性質的插件，
像是六角學院也設計了許多插件來協助工作效率上，
而若是你在電商公司時，也會需要寫 Chrome 插件。
　
其中最有名的應該就是求職天眼通了，
原開發者也是前端工程師，當初他是以 side project 來寫，
後來也因為吸引到許多關注，而辭職成立公司來經營。
　
[desktop app]
最為著名的就是 Eagle - 設計師圖片管理工具，
是一位寫 angular 的台灣前端設計師，雖然他不會寫桌面應用程式，
但只要你會 JS，你就能用 Electron 來開發跨平台的桌面應用程式，
現在他這個軟體已經廣受各個國家好評，只要你挖掘到使用者的痛點，
並想出辦法找到解決方案，那麼你也可以寫出讓全世界受益的軟體。
　
網址：https://tw.eagle.cool/
　
[WebGL 3D 開發]
WebGL 有辦法透過它在網頁開發 3D 介面，
舉凡博弈與其他視覺產業都會有大量運用，
錢景也非常不錯，畢竟業界相當缺乏會前端又對 3D 有 sense 的前端設計師。
　
以業界來說版塊便是其中的佼佼者。
官網：https://blockstudio.tw/
競選網頁：https://electionsdesign.com/
　
[mobile app]
最有名自然就是 React Native，
透過 JS 就能開發出雙平台，
講得好像很美好，但裡頭你必須針對各平台的雷點進行除錯，
但假使你掌握到裡頭的 know how，
業界目前也急需此前端人才，薪水也有辦法談得很高。
　
[Google Map]
搭配 D3.js 2D 視覺圖表，運用地圖 API 便能有各種可能。

最讓我印象深刻的就是 Uniform Map 制服地圖，
作者將各個學校的制服運用 Google Map 來呈現，
也由於他們理念廣受大家贊同，也接連募資成功。
　
除此之外，房仲產業也時常會用地圖顯示各地段的房價與物件，
只要跟地域有關的，你就不得不了解 Google Map API。
　
官網：https://uniform.wingzero.tw/school/map/tw
　
[PWA、AMP]
這已經是目前網頁上的最新趨勢，
讓網頁不論在效能與實用性又大幅加分，
但如果前面你沒涉獵一兩種更加認識 JS 的話，
要理解這段會難上加難，但他們勢必會變成未來的趨勢。
　
[專精 SPA 底層]
如果前面都不想投入，還想成為專才的話，
至少你要在 SPA 前後端分離上有卓越的研究，
各種非同步上 Observable 理解為何，其中著名框架是 RxJS，
另外要將弱型別變得易於管理，是否要改寫強型別 TypeScript？像是 Vue.js 老爸已經放話說，Vue 3.0 版本即將可以支援 TypeScript，你又了解多少？
　
看看下方的 Vue.js roadmap，你深入到哪了？每個技能都值得花半把個月研究
Vue Roadmap： https://github.com/flaviocopes/vue-developer-roadmap
　
【總結】
以上的技能只要你會其中的兩項，
並有設計出讓人使用的產品，年薪百萬只是基本，
沒有的請來找我，可再代為轉薦。
　
而這些你也可以參考成，
是否為投入下間公司的面試評估依據，
能夠研究新技術，同時又能對 JS 有深入了解，當然求之不得！
　
會整理這篇文章，
就是希望各位菜鳥前端瞭解，
找到第一份工作只是開始而已，
接下來你必須結合妳的興趣與熱情，
找到你想投入的項目，提升自己的技術價值。
　
若你沒任何動力搞 side project，
那麼就從面試公司挖掘你想投入的方向也是 ok 的。